import React from 'react';
import Content_7 from './content/Content_7';
import Content_picture from './content/Content_picture';
import Content_slide from './content/Content_slide';
import Content_dataCenter from './content/Content_dataCenter';
import Content_reportForm from './content/Content_reportForm';
import Content_imgSlide from './content/Content_imgSlide';
import Content_calendar from './content/Content_calendar';
import Content_newNotice from './content/Content_newNotice';
import Content_addWF from './content/Content_addWF';
import Content_contacts from './content/Content_contacts';
import Content_scratchpad from './content/Content_scratchpad';
import Content_weather from './content/Content_weather';
import Content_video from './content/Content_video';
import Content_audio from './content/Content_audio';
import Content_searchengine from './content/Content_searchengine';
import Content_blogStatus from './content/Content_blogStatus';
import Content_task from './content/Content_task';
import Content_16 from './content/Content_16';
import Content_19 from './content/Content_19';
import Content_25 from './content/Content_25';
import Content_flash from './content/Content_flash';
import Content_RankingList from './content/Content_RankingList';


class WeaElementPreview extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            data: {},
        };
        this.getElementStyle = this.getElementStyle.bind(this);
    }
    getElementStyle() {
        const { config = {} } = this.props;
        const { item } = config;
        let params = item;
        const { header } = item;
        if (header) {
            let estyle = {};
            const { toolbar = {}, style = {}, title = '', iconimg = {} } = header;
            const { close = {}, lock = {}, more = {}, refresh = {}, setting = {} } = toolbar;
            for (let key in style) {
                estyle[key] = style[key];
            }
            params = {
                refreshIconState: refresh.display == '',
settingIconState: setting.display == '',
closeIconState: close.display == '',
moreLocal: more.display == '',
                iconLogo: iconimg.src,
iconLock: lock.img,
iconRefresh: refresh.img,
iconSetting: setting.img,
iconClose: close.img,
iconMore: more.img,
title,
            };
            params.style = estyle;
        }
        this.setState({ data: params });
    }
    componentWillMount() {
        this.getElementStyle();
    }
    render() {
        const { data } = this.state;
        const { params, config } = this.props;
        const { eid, ebaseid } = config.item;
        const props = { eid, config, params, data };
        let tab4Content = <div />;
        switch (ebaseid) {
            case 'picture': // 图片元素预览
                tab4Content = <Content_picture ecId={`${this && this.props && this.props.ecId || ''}_Content_picture@78euq2`} ref={ebaseid} {...props} />;
                break;
            case 'Slide': // 幻灯片元素预览
                tab4Content = <Content_slide ecId={`${this && this.props && this.props.ecId || ''}_Content_slide@rpcea6`} ref={ebaseid} {...props} />;
                break;
            case 'DataCenter': // 个人中心元素预览
                tab4Content = <Content_dataCenter ecId={`${this && this.props && this.props.ecId || ''}_Content_dataCenter@agck6d`} ref={ebaseid} {...props} />;
                break;
            case 'reportForm': // 图表元素预览
                tab4Content = <Content_reportForm ecId={`${this && this.props && this.props.ecId || ''}_Content_reportForm@hwdz45`} ref={ebaseid} {...props} />;
                break;
            case 'imgSlide': // 多图元素预览
                tab4Content = <Content_imgSlide ecId={`${this && this.props && this.props.ecId || ''}_Content_imgSlide@tl3yz9`} ref={ebaseid} {...props} />;
                break;
            case 'MyCalendar':case 'MeetingCalendar': // 会议日历元素 || 日历日程元素
                tab4Content = <Content_calendar ecId={`${this && this.props && this.props.ecId || ''}_Content_calendar@6evqj7`} ref={ebaseid} {...props} />;
                break;
            case 'newNotice': // 公告元素预览
                tab4Content = <Content_newNotice ecId={`${this && this.props && this.props.ecId || ''}_Content_newNotice@o4fdgy`} ref={ebaseid} {...props} />;
                break;
            case 'addwf': // 新建流程元素
                tab4Content = <Content_addWF ecId={`${this && this.props && this.props.ecId || ''}_Content_addWF@uynrpg`} ref={ebaseid} {...props} />;
                break;
            case 'contacts': // 通讯录元素预览
                tab4Content = <Content_contacts ecId={`${this && this.props && this.props.ecId || ''}_Content_contacts@j7chtz`} ref={ebaseid} {...props} />;
                break;
            case 'scratchpad': // 便签元素预览
                tab4Content = <Content_scratchpad ecId={`${this && this.props && this.props.ecId || ''}_Content_scratchpad@tw1att`} ref={ebaseid} {...props} />;
                break;
            case 'weather': // 天气元素预览
                tab4Content = <Content_weather ecId={`${this && this.props && this.props.ecId || ''}_Content_weather@79o79c`} ref={ebaseid} {...props} />;
                break;
            case 'video': // 视频元素预览
                tab4Content = <Content_video ecId={`${this && this.props && this.props.ecId || ''}_Content_video@vc21m4`} ref={ebaseid} {...props} />;
                break;
            case 'audio': // 音频元素预览
                tab4Content = <Content_audio ecId={`${this && this.props && this.props.ecId || ''}_Content_audio@ofnwmn`} ref={ebaseid} {...props} />;
                break;
            case 'searchengine': // 搜索元素预览
                tab4Content = <Content_searchengine ecId={`${this && this.props && this.props.ecId || ''}_Content_searchengine@zjchw5`} ref={ebaseid} {...props} />;
                break;
            case 'blogStatus': // 微博元素预览
                tab4Content = <Content_blogStatus ecId={`${this && this.props && this.props.ecId || ''}_Content_blogStatus@y6yt0d`} ref={ebaseid} {...props} />;
                break;
            case 'Task': // 任务元素预览
                tab4Content = <Content_task ecId={`${this && this.props && this.props.ecId || ''}_Content_task@6veasp`} ref={ebaseid} {...props} />;
                break;
            case '16': // 我的邮件元素预览
                tab4Content = <Content_16 ecId={`${this && this.props && this.props.ecId || ''}_Content_16@naumv6`} ref={ebaseid} {...props} />;
                break;
            case '19': // 股票元素预览
                tab4Content = <Content_19 ecId={`${this && this.props && this.props.ecId || ''}_Content_19@ucxn8p`} ref={ebaseid} {...props} />;
                break;
            case '25': // 文档内容元素预览
                tab4Content = <Content_25 ecId={`${this && this.props && this.props.ecId || ''}_Content_25@6m7pd9`} ref={ebaseid} {...props} />;
                break;
            case 'Flash': // 文档内容元素预览
                tab4Content = <Content_flash ecId={`${this && this.props && this.props.ecId || ''}_Content_flash@ttcg1h`} ref={ebaseid} {...props} />;
                break;
            case 'RankingList': // 排行榜元素预览
                tab4Content = <Content_RankingList ecId={`${this && this.props && this.props.ecId || ''}_Content_RankingList@oidm0h`} ref={ebaseid} {...props} />;
                break;
            default: // 列表元素预览
                tab4Content = <Content_7 ecId={`${this && this.props && this.props.ecId || ''}_Content_7@oqiy69`} ref={ebaseid} {...props} />;
        }
        return tab4Content;
    }
}

export default WeaElementPreview;
